<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基础事件</title>
    <script src="./jquery1.11.3.js"></script>
    <script>
        $(function () {
            //第一种方法:
            // $('input').bind('click',function () {
            // alert("123");
            // });

            //第二种方法:
            // function fun() {
            // alert("我是fun");
            // }
            // $('input').bind('click',fun);
            // //点击按钮同时绑定2个事件
            // $('input').bind('mouseover mouseout',function () {
            //     alert("move");
            // });
            // $('input').bind({
            //     mouseover:function () {
            //         alert("你是一朵花");
            //     },
            //     mouseout:function () {
            //         alert("跟我走吧")
            //     }
            // });
            // $('input').unbind();//删除所有事件
            //  $('input').unbind('mouseover');//删除指定事件

            // function fun1() {
            //     alert("我是fun1函数");
            // }
            // function fun2() {
            //     alert("我是fun2函数");
            // }
            // $('input').bind('click',fun1);
            // $('input').bind('click',fun2);
            // $('input').unbind('click',fun1);//解绑

            //简写事件
            // $('input').click(function () {
            //     alert("你来吃饭吗");
            // });
            // $('input').mousedown(function () {
            //     alert("mousedown");
            // });
            // $(window).resize(function () {//窗口大小变化
            //     alert("size change");
            // });
            // $(window).scroll(function () { //滚动条滚动事件
            //     alert("scroll");
            // });
            // $('input').select(function () {
            //     alert("select");// 当我们选中内容时 会弹出select
            // });
            // $('input').change(function () {
            //     alert("change");// 当我们删除或者修改文本内容时，会弹出change
            // });
            $('form').submit(function () {
                alert("submit");//点击提交后 弹出submit
            });

        });
    </script>
</head>
<body>
<form >
    <input type="submit" name="" value="我是一只小小鸟">
</form>
<input type="button" value="按钮">
<input type="text" name="" value="内容">
<p>12</p><p>12</p><p>12</p><p>12</p><p>12</p><p>12</p><p>12</p>
<p>12</p><p>12</p><p>12</p><p>12</p><p>12</p><p>12</p><p>12</p>
<p>12</p><p>12</p><p>12</p><p>12</p><p>12</p><p>12</p><p>12</p>
<script>
    /* 一.绑定事件
            click dblclik mousedown mouseup mouseover mouseout change
            select submit keydown keypress keyup blur foucs load
            resize scroll error

        1.绑定事件 两种方法
                          1.  $('input').bind('click',function ()
                                alert("123");
                             });
                         2.  function fun() {
                                alert("我是fun");
                            }
                           $('input').bind('click',fun);
        2.两个事件绑定一个函数
                         $('input').bind('mouseover mouseout',function ()
                            alert("move");
                        });
       3.两个事件绑定2个函数
             第一种方法:     $('input').bind({
                            mouseover:function () {
                                alert("你是一朵花");
                                },
                             mouseout:function () {
                                 alert("跟我走吧")
                                 }
                       });
            第二种方法:function fun1() {
                        alert("我是fun1函数");
                        }
                      function fun2() {
                        alert("我是fun2函数");
                        }
                       $('input').bind('click',fun1);
                       $('input').bind('click',fun2);
      4.解绑事件
            1.删除所有事件    $('input').unbind()
            2.删除指定事件    $('input').unbind('mouseover')
     二.简写事件
           1. $('input').click(function () {
                alert("你来吃饭吗");
                });
          2. $('input').mousedown(function () {
                alert("mousedown");
              });
         3. $(window).resize(function () {//窗口大小变化
             alert("size change");
            });
         4. $(window).scroll(function () {
                alert("scroll");
           });
        5.  当我们选中内容时 会弹出select
                $('input').select(function () {
                alert("select");// 当我们选中内容时 会弹出select
                });
        6.$('input').change(function () {
            alert("change");// 当我们删除或者修改文本内容时，会弹出change
          });
       7.点击提交后 弹出submit
        $('form').submit(function () {
            alert("submit");
            });
    三.复合事件
    * */
</script>
</body>
</html>